<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
 <style>
    #div1{
	  width:300px;
	  height:150px;
	  border:solid 1px black;
	}
 </style>
 </head>
 <body>
    <div id="div1"></div>
	<button id="btn_create">增加</button> <button id="btn_clean">清除</button>
 </body>
 <script>
    var btn1 = document.getElementById("btn_create");
    var btn2 = document.getElementById("btn_clean");
	btn1.addEventListener("click",function(){
	   var div = document.getElementById("div1");
	   var span = document.createElement("span");
	   span.innerHTML = "增加";
	   span.style.color = "red";
	   span.style.lineHeight = "28px";
	   span.style.padding = "2px";
	   span.style.marginLeft = "3px";
	   span.style.backgroundColor = "yellow";
	   span.style.outline  ="solid 1px black";
	   div.appendChild(span);
	})
	btn2.addEventListener("click",function(){
	  var div = document.getElementById("div1");
	  div.innerHTML = "";
	})
 </script>
</html>
